<template>
    <div class="tablelist">
        <lay-table :columns="columns"
                   :data-source="storeMain.connect.databaselist_tabledata"
                   ref="tableRef"
                   @change="handleChange"
                   height="calc(100vh - 170px)"
                   even
                   size="sm"
                   resize
                   autoColsWidth
                   :loading="storeMain.connect.databaselist_tableloading"
                   :default-expand-all="storeMain.connect.expandAll"
                   :default-toolbar="['export','print','filter']"
                   v-model:selected-key="storeMain.connect.databaselist_tablerowSelectedKey"
                   @row="handleRowClick"
                   @row-double="handleRowDoubleClick"
        >
            <template #title="{ row, column, rowIndex, columnIndex }">
                <lay-button size="xs" type="primary" @click="handleShowTableList(row.TABLE_NAME)">查看</lay-button>
            </template>
        </lay-table>
    </div>
</template>
<script setup>
import {onMounted, ref} from "vue";
import {useStoreMain} from '../../store/storeindex.js';
const storeMain = useStoreMain();

// console.log(electron);
const process = ref(electron.process);
const handleShowTableList = (tablename) => {
    storeMain.home.tabs_current="2";
    storeMain.connect.queryTable(tablename);
}

onMounted(() => {
    storeMain.publicmain.ziyuanurl = $utilstoken.getStorage('ziyuanurl');
})

const columns = [
    {
        title: "选择",
        key: "TABLE_NAME",
        width: "50",
        fixed: "left",
        customSlot: 'title'
    },
    {
        title: "序号",
        type: "number",
        width: "50",
        fixed: "left",
    },
    {
        title: '表名',
        key: 'TABLE_NAME',
        width: "200",
        fixed: "left",
        ellipsisTooltip: true,
    },
    {
        title: '记录行',
        key: 'TABLE_ROWS',
        width: "60",
        fixed: "left",
        ellipsisTooltip: true,
    },
    {
        title: '大小',
        key: 'DATA_LENGTH',
        width: "60",
        fixed: "left",
        ellipsisTooltip: true,
    },
    {
        title: '创建时间',
        key: 'CREATE_TIME',
        width: "150",
        ellipsisTooltip: true,
    },
    {
        title: '修改时间',
        key: 'UPDATE_TIME',
        width: "150",
        ellipsisTooltip: true,
    },
    {
        title: '引擎',
        key: 'ENGINE',
        width: "60",
    },
    {
        title: '注释',
        key: 'TABLE_COMMENT',
        width: "250",
        ellipsisTooltip: true,
    },
    {
        title: '类型',
        key: 'TABLE_TYPE',
        width: "250",
        ellipsisTooltip: true,
    },
];
</script>
<style lang="scss" scoped>
.tablelist {
    padding: 0px;
    height: 100%;
    background-color: var(--base_bgcolor);
    overflow-y: auto;
}
</style>
